<template>
    <button
    class="yi-button"
    :class="[
    yitype?'yi-button-'+yitype:'yi-button-defalut',
    round?'yi-button-round':''
    ]"
    >
        <slot v-if="$slots.default"></slot>
        <span v-else>默认按钮</span>
    </button>
</template>
<script>
export default {
  props: {
    yitype: {
      type: String
    },
    round: {
      type: Boolean,
      default: false
    }
  }
}
</script>

<style lang="scss" scoped>
.yi-button{
white-space: nowrap;
    cursor: pointer;
    background: #fff;
    color: #606266;
    padding: 12px 20px;
    font-size: 14px;
    border-radius: 4px;
    outline: none;
    -webkit-appearance: none;
    color: white;
}
.yi-button-defalut{
  color:#aaa;
}
.yi-button-primary{
  background-color:#409eff;
}
.yi-button-success{
  background-color:#67c23a;
}
.yi-button-info{
  background-color:#909399;
}
.yi-button-warning{
  background-color:#e6a23c;
}
.yi-button-danger{
  background-color:#f56c6c;
}
.yi-button-round{
  border-radius: 25px;
}
</style>
